<template>
  <div class="footer-unit">
    <div class="flex">
        <span>Copyright © 2022 - ?</span>
        <span>|</span>
        <span>Power by <a href="https://v3.cn.vuejs.org/" target="_blank">Vue</a></span>
        <span>|</span>
        <span><i>Fin&nbsp;</i>——2022.8.2</span>
    </div>
    <div>诸君，有缘再见</div>
  </div>
</template>

<script>

export default {
    name: 'FooterUnit'
}
</script>

<style scoped>
    .footer-unit {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: 100px;
        margin-top: 20px;
        color: #fff;
        background-color: #545c64;
        cursor: default;
    }
    .flex {
        display: flex;
        justify-content: center;
        margin-bottom: 10px;
    }
    span {
        padding: 0 10px;
    }
    a {
        font-style: italic;
        text-decoration: none;
        color: #fff;
    }
    a:hover {
        color: skyblue;
    }
</style>